<template>
	<view>
		<dialog-shell ref="shell" title="用户登录" confirm-text="登录" @confirm="confirmLogin">
			<image src="../../static/icons/icon.png" class="icon"></image>
			<text class="welcome">WELOCOME!!</text>
			<text class="info-register" @click="clickGoRegister">没有账号？请注册</text>
			<view class="login-container">
				<input type="text" :value="userValue" placeholder="请输入用户名" 
				placeholder-class="input-holder" value="" @input="inputGetUser">
				<text class="iconfont icon-denglu ic-user"></text>
			</view>
			<view class="login-container" style="margin-bottom: 20rpx;">
				<input v-if="isPwd" :value="pwdValue" type="password" placeholder="请输入密码"
					placeholder-class="input-holder" @input="inputGetPwd">
				<input v-else :value="pwdValue" type="text" placeholder="请输入密码" placeholder-class="input-holder"
					@input="inputGetPwd">
				<text
					:class=" isPwd ? 'iconfont icon-yanjing ic-pwd-status' : 'iconfont icon-yanjing_yincang ic-pwd-status'"></text>
				<!-- 眼睛图标 -->
				<text class="iconfont icon-mima ic-user"></text> <!-- 密码图标 -->
			</view>
		</dialog-shell>
	</view>
</template>

<script>
	export default {
		name: "login-dialog",
		data() {
			return {
				isPwd: true,
				pwdValue: "",
				userValue: ""
			};
		},
		mounted() {
			let userInfo =uni.getStorageSync("userLoginInfo")
			if(userInfo){
				this.userValue=userInfo.userName
				this.pwdValue=userInfo.password
			}
		},
		methods: {
			//注册跳转
			clickGoRegister(){
				uni.navigateTo({
					url: '../../pages/register/register',
					success: res => {
						// this.$refs.shell.clickTohide()
					},
					fail: () => {},
					complete: () => {}
				});
			},
			show() {
				this.$refs.shell.show();
			},
			clickSwtich() {
				this.isPwd = !this.isPwd
			},
			// 获取输入密码的值
			inputGetPwd(e) {
				this.pwdValue = e.detail.value
			},
			// 获取输入用户名值
			inputGetUser(e) {
				this.userValue = e.detail.value
			},
			confirmLogin() {
				// 判断输入框是否为空,空则不发送请求
				if (this.userValue.length == 0 || this.pwdValue.length == 0) {
					uni.showToast({
						title: '请输入用户和密码',
						icon: 'none'
					});
					return
				}
				//请求url地址
				
				let url = this.$params.host + this.$params.action_login
				//请求携带的data数据
				let data={
					username : this.userValue,
					password : this.pwdValue
				}
				//post请求
				this.$request.post(url, data, res => {
						uni.showToast({
							title:res.message,
							icon:'none'
						});
						if(!res.success)   {
						this.$refs.shell.show()
						this.userValue=''
						this.pwdValue=''
						return
					    }
					console.log(res.data)
					uni.getStorageSync("userLoginInfo", data)
					let app = getApp()
					app.globalData.uid =res.data.id
					app.globalData.token=res.data.token
					app.globalData.avatar=res.data.avatar
					app.globalData.type=res.data.type
					app.globalData.nickName=res.data.nickName
					app.globalData.userName=res.data.userName
					app.globalData.email=res.data.email
					console.log(getApp().globalData)
					this.$emit('after')
				}, () => {})
			}
		}
	}
</script>

<style>
	@import url("login-dialog.css");
</style>
